<script setup lang="ts">
import UserInfoCard from '@/components/userInfoCard/index.vue'
import {computed} from "vue";
import {useAppConfigStore} from "@/store/system/appConfigStore";
import UserTask from "@/components/userTask/index.vue"
import TagCloud from "@/components/tagCloud/index.vue"
import FollowUs from "@/components/followUs/index.vue"

const componentShowMap = computed(() => useAppConfigStore().componentShowMap)

</script>

<template>
  <section class="homeSidebar mt-2.5 relative lg:flex lg:w-1/3 overflow-hidden min-h-[400px] float-right hidden flex-col gap-5">
    <UserInfoCard v-if="componentShowMap.showUserCard"/>
    <!-- 用户任务 -->
    <UserTask v-if="componentShowMap.showUserTask"/>
    <!-- 热门标签 -->
    <TagCloud v-if="componentShowMap.showHotTag"/>
    <!-- 关注我们 -->
    <FollowUs v-if="componentShowMap.showFollowUs"/>
  </section>
</template>

<style scoped lang="less">
.homeSidebar {
  margin-bottom: var(--edge-tb);
}
</style>
